<template>
   <div>
      <LayoutHeader />
      <slot></slot>
      <LayoutFooter />
      <div class="APP"></div>
      <div class="AOIR-CONTACT-ME">
         <svg t="1599210542874" class="AOIR-SERVICE-ICON" viewBox="0 0 1024 1024" version="1.1"
            xmlns="http://www.w3.org/2000/svg" p-id="16321" width="30" height="30">
            <path d="M224.99 512a287.01 287.01 0 1 0 574.02 0 287.01 287.01 0 1 0-574.02 0z" fill="#FFDA33" p-id="16322">
            </path>
            <path
               d="M659.18375 635.7275c5.61375-6.55875 3.74625-16.86375-2.82375-22.5-6.5475-5.61375-16.86375-3.735-22.48875 2.82375-33.75 37.485-70.30125 55.305-121.86 55.305-51.55875 0-84.375-14.0625-121.87125-55.305-5.625-6.57-15.94125-8.4375-22.5-2.82375-6.57 5.63625-8.4375 15.94125-2.8125 22.5 44.055 49.69125 85.30875 68.43375 147.18375 68.43375 61.86375 0 107.7975-22.48875 147.1725-68.43375zM390.15125 469.8125v-56.25c0-14.99625-12.18375-28.125-28.125-28.125-14.99625 0-28.11375 12.18375-28.11375 28.125v56.25c0 14.99625 12.1725 28.125 28.11375 28.125 14.99625 0 28.125-12.18375 28.125-28.125z m494.94375-59.0625c-42.1875-170.6175-193.10625-297.1575-373.08375-297.1575-179.98875 0-330.9075 126.54-373.10625 297.1575-45 16.875-76.87125 66.555-76.87125 124.68375 0 66.56625 42.1875 121.86 97.4925 130.30875 0 0 0 0.93375 0.945 0.93375h62.80875a339.87375 339.87375 0 0 1-39.375-159.3675c0-186.5475 147.18375-337.4775 328.10625-337.4775s328.08375 150.93 328.08375 337.4775c0 125.60625-66.54375 234.36-165.915 292.48875A54.9 54.9 0 0 0 661.0625 797.91875c-30.9375 0-56.25 25.30125-56.25 56.2275 0 30.94875 25.3125 56.26125 56.25 56.26125 30.92625 0 56.23875-25.3125 56.23875-56.26125 0-4.68-0.93375-9.36-1.87875-13.10625 64.6875-42.1875 117.18-103.12875 148.12875-175.2975 55.29375-9.39375 98.415-63.7425 98.415-130.30875 0-58.12875-32.81625-107.80875-76.87125-124.68375z m-194.985 59.0625v-56.25c0-14.99625-12.18375-28.125-28.11375-28.125-15.0075 0-28.125 12.18375-28.125 28.125v56.25c0 14.99625 12.18375 28.125 28.125 28.125 14.99625 0 28.11375-12.18375 28.11375-28.125z"
               fill="#515151" p-id="16323" data-spm-anchor-id="a313x.7781069.0.i0" class=""></path>
         </svg>
         获取授权
      </div>
      <div class="AOIR-TOOLBAR-IN-THE-LOWER-RIGHT-CORNER">
         <div class="toolbar-top">
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-huiyuan-"></span>
               <div class="vipname">vip</div>
            </div>
            <!-- </el-tooltip> -->
         </div>
         <div class="toolbar-center">
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-biaoqian"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-send-o"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-biaoqian"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-gengxin"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-biaoqian"></span>
            </div>
            <!-- </el-tooltip> -->
         </div>
         <div class="toolbar-bottom">
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-pifugexinghuazhuti-xianxing"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-biaoqian"></span>
            </div>
            <!-- </el-tooltip> -->
            <!-- <el-tooltip content="开发中..." placement="left" effect="light"> -->
            <div class="xbox">
               <span class="iconfont icon-chakantiezigengduojubao"></span>
            </div>
            <!-- </el-tooltip> -->
         </div>
      </div>
   </div>
</template>
<script lang="ts" setup >
</script>
<style lang="scss" scoped>
.AOIR-CONTACT-ME {
   position: fixed;
   left: 0;
   top: 40%;
   transform: translateY(-50%);
   width: 42px;
   background-color: var(--aoir-color-primary-2);
   padding: 12px 8px;
   color: #FFF;
   border-radius: 0 10px 10px 0;
   writing-mode: vertical-rl;
   line-height: 30px;
   letter-spacing: 3px;
   cursor: pointer;
   transition: all .2s;
   box-shadow: rgba(0, 0, 0, 0.08) 0px 5px 6px -4px, var(--aoir-color-primary-2) 0px 6px 10px;

   &:hover {
      opacity: .8;
   }
}

.AOIR-TOOLBAR-IN-THE-LOWER-RIGHT-CORNER {
   position: fixed;
   right: 0;
   bottom: 50px;

   .toolbar-top {
      display: flex;
      flex-direction: column;
      box-shadow: -8px 0px 35px 0px rgb(181 181 181 / 32%);
      background-color: var(--aoir-color-primary);
      margin-bottom: 15px;
      border-radius: var(--aoir-border-radius) 0 0 var(--aoir-border-radius);
      overflow: hidden;

      .xbox {
         width: 50px;
         height: 100px;
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
         cursor: pointer;

         .iconfont {
            font-weight: 600;
            font-size: 19px;
            color: #FFF;
         }

         .vipname {
            font-size: 15px;
            color: #FFF;
            font-weight: 600;
         }
      }
   }

   .toolbar-center {
      display: flex;
      flex-direction: column;
      box-shadow: -8px 0px 35px 0px rgb(181 181 181 / 32%);
      background-color: #fff;
      margin-bottom: 15px;
      border-radius: var(--aoir-border-radius) 0 0 var(--aoir-border-radius);
      overflow: hidden;

      .xbox {
         width: 50px;
         height: 50px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;

         .iconfont {
            font-size: 20px;
            color: #5f6575;
            font-weight: 700;
         }
      }
   }

   .toolbar-bottom {
      display: flex;
      flex-direction: column;
      box-shadow: -8px 0px 35px 0px rgb(181 181 181 / 32%);
      background-color: #fff;
      border-radius: var(--aoir-border-radius) 0 0 var(--aoir-border-radius);
      overflow: hidden;

      .xbox {
         width: 50px;
         height: 48px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;

         .iconfont {
            font-size: 20px;
            color: #5f6575;
            font-weight: 700;
         }
      }
   }
}
</style>